<script setup lang="ts">
import {useSgesAStore} from "./storeSgesCalA.ts";
import {storeToRefs} from "pinia";
import type {FormInst, FormItemRule} from 'naive-ui'

const store = useSgesAStore()
const {
  vibrant_para,
  heightTower,
  density,
  lengthBlock,
  widthBlock,
  heightBlock,
  etaSystem,
  numOfTowers,
  numOfGroups,
  numBlocksPerGroup,
  g,
  diameterReel,
  lengthReel,
  safetyRatioRope,
  numRopePerBlock,
  numPulleyPerRope,
  speedRotateGen,
  speedRatio1,
  timeSinglePass,
} = storeToRefs(store)

const rules = {
  etaSystem: [
    {
      required: true,
      validator(rule: FormItemRule, value: number) {
        if (value > 1 || value < 0.6) {
          return new Error("重力储能系统效率大于0.6且小于1.0")
        }
      },
      trigger: ['input', 'blur']
    }
  ]
}
</script>

<template>
  <div>
    <n-tag>设计可变条件</n-tag>
    <n-form id="sges1" ref="Sges1Form1" inline :label-width="120" :rules="rules"
            size="small" label-placement="left" :style="{minWidth: '640px'}"
    >
      <n-flex>
        <n-form-item label="塔群数" path="numTowerGroup">
          <n-input-number v-model:value="numOfTowers" placeholder=""></n-input-number>
          <label></label>
        </n-form-item>
        <n-form-item label="塔群中塔列数" path="capacityChargeTotalStation">
          <n-input-number v-model:value="numOfGroups" placeholder=""></n-input-number>
          <label>列</label>
        </n-form-item>
        <n-form-item label="每列塔数" path="capacityChargeTotalStation">
          <n-input-number v-model:value="numBlocksPerGroup" placeholder=""></n-input-number>
          <label>个</label>
        </n-form-item>

        <n-form-item label="系统效率" path="etaSystem" v-show="vibrant_para!==6">
          <n-input-number v-model:value="etaSystem" placeholder="" :show-button="false"></n-input-number>
          <label></label>
        </n-form-item>
        <n-form-item label="有效提升高度" path="height_tower" v-show="vibrant_para!==1">
          <n-input-number v-model:value="heightTower" placeholder=""></n-input-number>
          <label>m</label>
        </n-form-item>
        <n-form-item label="重物高度" path="height_block" v-show="vibrant_para!==5">
          <n-input-number v-model:value="heightBlock" placeholder=""></n-input-number>
          <label>m</label>
        </n-form-item>
        <n-form-item label="重物长" path="length_block" v-show="vibrant_para!==3">
          <n-input-number v-model:value="lengthBlock" placeholder=""></n-input-number>
          <label>m</label>
        </n-form-item>
        <n-form-item label="重物宽" path="width_block" v-show="vibrant_para!==4">
          <n-input-number v-model:value="widthBlock" placeholder=""></n-input-number>
          <label>m</label>
        </n-form-item>
        <n-form-item label="重物密度" path="density_block" v-show="vibrant_para!==2">
          <n-input-number v-model:value="density" placeholder=""></n-input-number>
          <label>m</label>
        </n-form-item>
        <n-form-item label="卷筒直径" path="diameterReel">
          <n-input-number v-model:value="diameterReel" placeholder=""></n-input-number>
          <label>m</label>
        </n-form-item>
        <n-form-item label="卷筒长度" path="lengthReel">
          <n-input-number v-model:value="lengthReel" placeholder=""></n-input-number>
          <label>m</label>
        </n-form-item>
        <n-form-item label="单重物钢丝绳数" path="safetyRatioRope">
          <n-input-number v-model:value="numRopePerBlock" placeholder=""></n-input-number>
          <label></label>
        </n-form-item>
        <n-form-item label="动滑轮数" path="safetyRatioRope">
          <n-input-number v-model:value="numPulleyPerRope" placeholder=""></n-input-number>
          <label></label>
        </n-form-item>
        <n-form-item label="钢丝绳安全系数" path="safetyRatioRope">
          <n-input-number v-model:value="safetyRatioRope" placeholder=""></n-input-number>
          <label></label>
        </n-form-item>
        <n-form-item label="发电机转速" path="safetyRatioRope">
          <n-input-number v-model:value="speedRotateGen" placeholder=""></n-input-number>
          <label></label>
        </n-form-item>
        <n-form-item label="螺伞变速比" path="safetyRatioRope">
          <n-input-number v-model:value="speedRatio1" placeholder=""></n-input-number>
          <label></label>
        </n-form-item>
        <n-form-item label="单程运行时间" path="safetyRatioRope">
          <n-input-number v-model:value="timeSinglePass" placeholder=""></n-input-number>
          <label>h</label>
        </n-form-item>
      </n-flex>
    </n-form>

  </div>
</template>

<style scoped>

.n-tag {
  border: coral;
  background-color: coral;
  width: 100%;
}

.n-input-number {
  width: 120px;
}

.n-input {
  width: 120px;
}

.n-form-item {
  min-width: 300px;
}

.label {
  width: 120px;
}
</style>